<script setup lang="ts">
import BaseWindow from "../../base-window/index.vue";
import { ref } from "vue";
// const tables = ref([
//   {
//     label: "大棚名称",
//     value: "xxx大棚",
//   },
//   {
//     label: "大棚面积：",
//     value: "xxx㎡",
//   },

// ]);
const urls = ["", ""];
</script>

<template>
  <BaseWindow title="实时监控">
    <div class="row-wrapper">
      <div class="row" v-for="item in urls">
        <n-spin :show="true"></n-spin>
      </div>
    </div>
  </BaseWindow>
</template>

<style lang="scss" scoped>
.row-wrapper {
  display: flex;
}
.row {
  background-image: url("../../../assets/images/monitor-wrapper.png");
  height: 228px;
  width: 228px;
  display: flex;
  align-items: center;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  font-size: 20px;
  font-weight: 400;
  margin-right: 10px;
  .label {
    color: #4ce879;
  }
  .value {
    margin-left: 1em;
  }
}
</style>
